import React from 'react'


import {Dimensions, Image, NativeModules, Platform, StyleSheet, Text, TouchableOpacity, View} from 'react-native';
import BasePage from './Component/Common/BasePage';
import {NavigationBar} from 'teaset';
import CommonStyle from "./Component/CommonStyle";
import PageView from "./Component/Common/PageView";

import SQLite from './SQLite';

var sqLite = new SQLite();
var db;

const defaultOptions = {
    imageCount: 1,             // 最大选择图片数目，默认6
    isRecordSelected: false,   // 是否已选图片
    isCamera: true,            // 是否允许用户在内部拍照，默认true
    isCrop: true,             // 是否允许裁剪，默认false, imageCount 为1才生效
    CropW: ~~(width * 0.6),    // 裁剪宽度，默认屏幕宽度60%
    CropH: ~~(width * 0.6),    // 裁剪高度，默认屏幕宽度60%
    isGif: false,              // 是否允许选择GIF，默认false，暂无回调GIF数据
    showCropCircle: true,     // 是否显示圆形裁剪区域，默认false
    circleCropRadius: width / 2, // 圆形裁剪半径，默认屏幕宽度一半
    showCropFrame: true,       // 是否显示裁剪区域，默认true
    showCropGrid: false,       // 是否隐藏裁剪区域网格，默认false
    quality: 90,               // 压缩质量
    enableBase64: false,       // 是否返回base64编码，默认不返回
};
const {RNSyanImagePicker} = NativeModules;

const {width} = Dimensions.get('window');


export default class Message extends BasePage {


    constructor(props) {
        super(props);
        this.state = {
            ...this.state,

            isshow: false

        };

    }

    componentWillMount() {


        this.showLoad(true)
        setTimeout(this.openApp.bind(this), 2000);
    }

    openApp() {
        this.showLoad(false)

        this.setState({
            isshow: true
        })
    }


    renderNavigationBar() {
        return (
            <NavigationBar
                style={{backgroundColor: 'white',}}

                title={
                    <View style={{
                        flexDirection: 'row',
                        justifyContent: 'center',
                        alignSelf: 'center',

                    }}>
                        <Text style={{
                            fontSize: 20,
                            color: '#333333'
                        }}>全部信息</Text>
                    </View>}

                leftView={<TouchableOpacity
                    onPress={() => {


                        this.navigator.pop();


                        // DeviceEventEmitter.emit('my', {text: '刷新'})

                    }}
                >
                    <Image style={{width: 20, height: 20, marginLeft: 20}} source={require('./images/btn_back.png')}/>

                </TouchableOpacity>}

            />

        );
    }


    _onChangeText(inputData) {
        console.log("输入的内容", inputData);
        //把获取到的内容，设置给showValue
        // this.setState({showValue: inputData});
    }

    renderPage() {


        return (


            <PageView style={{
                flex: 1
            }} hiddenNav={true} fromPage={this} {...this.state}>
                {
                    this.state.isshow ?
                        <View style={{
                            flexDirection: 'column',
                            marginTop: 46,
                            flex: 1
                        }}>
                            <View
                                style={{
                                    flexDirection: 'row',
                                    justifyContent: 'center',
                                    alignItems: 'center',
                                    marginTop: 60
                                }}>
                                <Image source={require('./images/message.png')}
                                       style={{height: 80, width: 80,}}/>

                            </View>
                            <Text style={{
                                textAlign: 'center',
                                marginTop: 20,
                                width: screenW,
                                color: '#cdcdcd'
                            }}>没有设备消息提示</Text>
                        </View>

                        : null
                }

            </PageView>

        );

    }

    componentDidMount() {
        this.setState({
            refreshing: true,
        })
        setTimeout(() => {
            this.setState({
                refreshing: false,
            })
        }, 3000)
    }


}
let screenW = Dimensions.get('window').width;
let screenH = Dimensions.get('window').height;
// iPhoneX
const X_WIDTH = 375
const X_HEIGHT = 812
const styles = StyleSheet.create({
    container: {
        flex: 1,
        marginBottom: Platform.OS === 'ios' &&
        ((screenH === X_HEIGHT && screenW === X_WIDTH) ||
            (screenH === X_WIDTH && screenW === X_HEIGHT)) ? 34 : null
    },
    title: {
        flexDirection: 'row',
        width: CommonStyle.screenwidth
    },
    title_left: {
        marginLeft: 15,
        alignSelf: 'center'
    },

    title_right: {
        fontSize: 14,
        color: CommonStyle.color_deep_red,
        marginRight: 15,
        alignSelf: 'center'
    },
    button: {
        height: 29,
        width: CommonStyle.screenwidth / 5,
        flexDirection: 'row', justifyContent: 'flex-end',
        borderBottomLeftRadius: 5,
        borderTopLeftRadius: 5,
    },
    button2: {
        height: 29,
        width: CommonStyle.screenwidth / 5,
        flexDirection: 'row',
        borderTopRightRadius: 5,
        borderBottomRightRadius: 5,
    },

    tab1Style: {

        alignItems: 'center',
        justifyContent: 'center',
        backgroundColor: 'white',

    },
    tab2Style: {
        alignItems: 'center',
        justifyContent: 'center',
        backgroundColor: '#1196DB',

    },
    tab3Style: {
        alignItems: 'center',
        justifyContent: 'center',
        backgroundColor: '#1196DB',
    },
    tab4Style: {
        alignItems: 'center',
        justifyContent: 'center',
        backgroundColor: 'white',
    },
    newText1Style: {
        fontSize: 11,
        color: '#1196DB'
    },
    newText2Style: {
        fontSize: 11,
        color: 'white'
    }, inputStyle: {
        flex: 1,
        marginRight: 15,
        marginLeft: 5,
    }
});
